
<script setup lang="ts">
import {useUserStore} from '@/stores/user'
// 因为在使用的时候 pinia 中的数据是响应式的
const user=useUserStore()
// 因为在使用本地存储的时候数据不是响应式
// const token=localStorage.getItem('token')||''//这个要手动刷新才能实现文字的切换效果 退出登陆的时候要手动刷新才显示去登陆 不然还是购物车
// 所以在使用的时候分情况选择使用 pinia 还是 本地存储，大多是使用 pinia

</script>
<template>
<!-- 通过命名路由去除部分页面的footer组件显示 -->
        <footer >
            <router-link to="/home">
                <!-- 用来显示图标用的 -->
                <span class="iconfont icon-shouye"></span>
                <!-- 显示标题用的 -->
                <p>首页</p>
            </router-link>
            <router-link to="/sort">
                <span class="iconfont icon-fenlei"></span>
                <p>分类</p>
            </router-link>
            <router-link :to=" user.isLogin?'/cart':'/login'">
                <span class="iconfont icon-gouwuche"></span>
                <p>{{ user.isLogin?'购物车':'去登录' }}</p>
                <!-- <p>{{ token?'购物车':'去登录' }}</p>不要响应式数据的时候可以考虑本地存储 -->
            </router-link>
            <router-link to="/my">
                <span class="iconfont icon-My"></span>
                <p>我的</p>
            </router-link>
        </footer>

</template>